<template>
	<div class="sys-org-container">

		<div style="width: 100%;">
			<screeningCondition :inquireInfo="state.inquireInfo" @getChildren="getData"></screeningCondition>

		</div>

		<el-card class="full-table" shadow="hover" style="margin-top: 5px">
			<el-table :data="state.Data" v-loading="state.loading" row-key="id" default-expand-all
				:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" border highlight-current-row
				:header-cell-style="{
					background: 'var(--el-color-primary)',
					height: '55px', color: '#fff', border: '1px solid #fff', fontWeight: 'bold', fontSize: '13px'
				}" :cell-style="{ padding: '2px' }" class="el-table">
				<el-table-column type="index" label="序号" align="center"></el-table-column>
				<!-- <el-table-column prop="alarmReadFlag" label="报警是否已读" align="center" header-align="center"
					show-overflow-tooltip width="100">
					<template v-slot="scope">
						<span v-if="scope.row.alarmReadFlag == 1">成功</span>

						<span v-else>失败</span>
					</template>
</el-table-column> -->
				<el-table-column prop="alarmTypeName" label="报警类型" align="center" show-overflow-tooltip />

				<el-table-column prop="unitTypeDesc" label="警报等级" width="80" align="center" show-overflow-tooltip />

				<el-table-column prop="alarmStatusDesc" label="警报状态" width="80" align="center" show-overflow-tooltip />
				<el-table-column prop="deviceNumber" label="AGV编号" width="80" align="center" show-overflow-tooltip />

				<el-table-column prop="areaName" label="地图名称" align="center" show-overflow-tooltip />

				<el-table-column prop="channelDeviceId" label="节点名称" align="center" show-overflow-tooltip />

				<el-table-column prop="channelName" label="处理意见" align="center" show-overflow-tooltip />


				<el-table-column prop="remark" label="异常原因" align="center" show-overflow-tooltip />


				<el-table-column prop="insertTimeStr" label="报警时间" align="center" show-overflow-tooltip />

				<!-- <el-table-column prop="invalidDateStr" label="时间" align="center" show-overflow-tooltip /> -->

				<!-- <el-table-column label="操作" fixed="right" align="center" show-overflow-tooltip>
							<template #default="scope">
								<el-button icon="ele-View" size="small" text type="primary"
									@click="openEditOrg(scope.row)" v-auth="'sysOrg:delete'"> 详情 </el-button>
							</template>
						</el-table-column>  -->
			</el-table>
			<el-pagination v-model:current-page="state.queryParams.page" v-model:page-size="state.queryParams.pageSize"
				:page-sizes="[20, 30, 40, 50]" layout="->,total, sizes, prev, pager, next, jumper" :total="state.total"
				@size-change="handleSizeChange" @current-change="handleCurrentChange" :small="true" />
		</el-card>




		<EditOrg ref="editOrgRef" :title="state.editOrgTitle" />
	</div>
</template>

<script lang="ts" setup name="sysOrg">
import { onMounted, reactive, ref } from 'vue';
import EditOrg from '/@/views/system/putInStorage/component/editOrg.vue';
import { WmsApi } from '/@/api/wh';
import screeningCondition from '/@/views/tools/screeningCondition.vue'


const editOrgRef = ref();
const state = reactive({
	loading: false,
	Data: [], // 机构列表数据
	queryParams: {
		areaId: 1,
		userId: 4,
		beginDate: '',
		endDate: '',
		pageNo: 1,
		pageSize: 20,
	},

	ruleForm: {},
	total: 0,
	inquireInfo: [
		
		{
			label: "报警时间",
			value: "",
			key: "inAndOutBoundTimeRange",
			options: [],
			type: 'date'
		},
		{
			label: "报警等级",
			value: "",
			key: "unitTypeDesc",
			options: [
			{
                        value: '告警',
                        label: "告警",
                    },
                    {
                        value: '提示',
                        label: "提示",
                    },
                    {
                        value: '紧急',
                        label: "紧急",
                    },
			],
			type: 'select'
		}
	],
	value: {}
	// editDrawer:false
});

onMounted(() => {
	getData(state.queryParams);
});
const getData = (value: any) => {
	
	
	// console.log(value.inAndOutBoundTimeRange[0]);
	if (value.hasOwnProperty('inAndOutBoundTimeRange')) {
		value.beginDate = value.inAndOutBoundTimeRange[0];
		value.endDate = value.inAndOutBoundTimeRange[1];
	}
	//保留先前的搜索条件
	state.value = value;
	console.log(value);
	var params = {
		pageNo: state.queryParams.pageNo,
		unitTypeDesc:value.unitTypeDesc,
		pageSize: state.queryParams.pageSize,
		areaId: 1,
		userId: 1,
		beginDate: value.beginDate,
		endDate: value.endDate

	}
	console.log(value.endDate);

	WmsApi().getAlarm(params)
		.then(function (res) {
			console.log(res);
			state.Data = res.data.result.list;
			state.total = res.data.result.total;
		})
		.catch(function (error) {
			console.log(error);
		});
}



const handleSizeChange = (val) => {
	state.queryParams.pageSize = val;
	state.queryParams.beginDate = state.value.beginDate;
	state.queryParams.endDate = state.value.endDate;

	getData(state.queryParams);
};
const handleCurrentChange = (newVal) => {
	state.queryParams.pageNo = newVal;
	state.queryParams.beginDate = state.value.beginDate;
	state.queryParams.endDate = state.value.endDate;


	getData(state.queryParams);
};

</script>
<style lang="scss" scoped>
.fl {
	width: 60%;
	margin: 20px 80px;
}
</style>
